<template>
    <view class="content" :style="{ height: windowHeight + 'px' }">
        <view class="view">
            <view class="header">
                <view class="label">定位/最近访问</view>
                <view class="value" v-if="currentSchool">
                    <image class="image" src="https://dujiaojing.oss-cn-huhehaote.aliyuncs.com/uploads/2025/7/29/1753776237506_a4538f71/address.png?x-oss-process=image/resize,w_300" alt=""></image>
                    <view class="address">{{ currentSchool }}</view>
                </view>
            </view>
            <view class="list">
                <view class="label">更多校区</view>
                <view class="content">
                    <view v-for="(item, index) in list" :key="index" class="value" @click="addressClick(item)">
                        {{ item.deptName }}
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
import { systemInfo } from '../../utils/mixin'
import { optionSchool } from '@/api/index.js'
export default {
    components: {},
    mixins: [systemInfo],
    data() {
        return {
            list: [],
            currentSchool: ''
        }
    },
    async onLoad() {
        // 状态栏高度
        this.getSystemInfo();

        // 获取学校
        const res = await optionSchool()
        this.list = res.data
        this.currentSchool = uni.getStorageSync('deptName')
        
    },
    methods: {
        addressClick(item) {
            uni.setStorageSync('deptName', item.deptName)
            uni.switchTab({
                url: "/pages/tabbar/home/home"
            })
        }
    }
}
</script>

<style lang="less" scoped>
.content {
    background-color: rgb(245, 245, 245);
    width: 100%;
    box-sizing: border-box;

    .view {
        width: calc(100% - 60rpx);
        height: calc(100% - 60rpx);
        margin-top: 30rpx;
        box-sizing: border-box;
        padding: 30rpx;
        background-color: #fff;
        position: relative;
        top: 30rpx;
        margin: auto;
        overflow: auto;

        .header {
            width: 100%;

            .value {
                display: flex;
                align-items: center;
                background-color: rgb(34, 175, 229);
                color: #fff;
                width: fit-content;
                padding: 10rpx;
                border-radius: 8rpx;
                margin-top: 20rpx;
                margin-left: 20rpx;

                .image {
                    margin-right: 8rpx;
                    width: 22rpx;
                    height: 26rpx;
                }
            }
        }

        .list {
            width: 100%;
            margin-top: 40rpx;

            .content {
                display: flex;
                align-items: center;
                justify-content: space-between;
                flex-wrap: wrap;
                background-color: #fff;
            }

            .value {
                margin-top: 20rpx;
                margin-left: 20rpx;
                padding: 10rpx;
                border-radius: 8rpx;
                color: rgb(179, 173, 173);
                width: fit-content;
                border: 1px solid rgb(179, 173, 173);
            }
        }
    }
}
</style>